<template>
  <div><el-button type="primary" @click="getAvatar" icon="el-icon-download" round>获取头像</el-button>
     <div class="head_img">
              <img :src="userinfo.avatar"/>
     </div>
  
  </div>
</template>
<script>
export default {
  name: 'Test',
  data() {
    return {
      uid:'',
      userinfo:{
      avatar:'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2992840297,621717109&fm=26&gp=0.jpg'
    }
    };
  },
  methods: {
   getAvatar(){
     console.log("获取头像")
      this.$prompt('请输入用户id', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          inputPattern: /^[A-Za-z0-9]+$/,
          inputErrorMessage: '用户id格式不正确'
        }).then(({ value }) => {
      this.uid = value;
      console.log("this.id:"+this.uid)
      var that = this

        this.$http(this.$api.getAvatar, {uid:this.uid}).then(res => {
        console.log(res)
        this.userinfo = res.data
          
        }, fail => {
          that.$message.error('错误'+fail)
          // ceshi
        })

          
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '取消输入'
          });       
        });
      
        
   }
  },
  mounted() {
  
  },
  beforeCreate() {
   
  }
}

</script>
<style scoped>

</style>

